.fade-enter-active {
  animation: fade-in 1.5s;
}

.fade-leave-active {
  animation: fade-out 1.5s;
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fade-out {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.fade-window-enter-active {
  animation: fade-window-in 0.2s;
}

.fade-window-leave-active {
  animation: fade-window-out 0.2s;
}

@keyframes fade-window-in {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes fade-window-out {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0);
  }
}

.fade-menu-enter-active {
  animation: fade-menu-in 0.1s;
}

.fade-menu-leave-active {
  animation: fade-menu-out 0.1s;
}

@keyframes fade-menu-in {
  0% {
    width: 0;
    opacity: 0;
  }

  100% {
    width: 200px;
    opacity: 1;
  }
}

@keyframes fade-menu-out {
  0% {
    width: 200px;
    opacity: 1;
  }

  100% {
    width: 0;
    opacity: 0;
  }
}

@keyframes jump-animation {
  0% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-20px);
  }

  100% {
    transform: translateY(0);
  }
}

@keyframes dock-title-animation {
  0% {
    top: 0;
    opacity: 0;
  }

  100% {
    top: -40px;
    opacity: 1;
  }
}

@keyframes input-error-animation {
  0% {
    transform: scale(0.8);
  }

  50% {
    transform: scale(1.1);
  }

  100% {
    transform: scale(1);
  }
}

/* 桌面图标悬浮摇摆 */
@keyframes app-item-hover {
  0% {
    transform: rotate(6deg);
  }

  25% {
    transform: rotate(-6deg);
  }

  50% {
    transform: rotate(6deg);
  }

  75% {
    transform: rotate(-6deg);
  }

  100% {
    transform: rotate(0deg);
  }
}

@keyframes shark-wrap {
  to {
    transform: translateX(100%);
  }
}
